<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1, maximum-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=11" />
    <title>{{product}}</title>
    <link rel="icon" href="data:image/jpeg;base64,{{favicon}}">
    {{!-- <link rel="stylesheet" type="text/css" href="/static/SourceHanSansCNNormalFont/fontblock.css" /> --}}
    <style>
        body{
           font-family: "-apple-system", "BlinkMacSystemFont", "Helvetica Neue", "PingFang SC","Microsoft YaHei", "sans-serif";
        }
       .box{
           width: 320px;
           height: 245px;
           margin-left: auto;
           margin-right: auto;
           margin-top: 10%;
       }
       .logo{
           margin-left: 65px;
           margin-bottom: 35px;
       }
       .tips{
           width: 100%;
           text-align: center;
           padding-bottom: 30px;
       }
       .tips-title{
           font-size: 14px;
           color: #000000;
           opacity: 0.55;
       }
       .input-box{
           width: 100%;
           height: 30px;
           border-bottom: 1px solid #d3d4db;
       }
       .lock{
           margin-left: 16px;
           margin-right: 25px;
           width: 16px;
           height: 16px;
           position: relative;
           top: 4px;
       }
       .password-input{
           width: 250px;
           border: none;
       }
       .password-input::-ms-reveal{
           display: none;
       }
       .button{
           margin-top: 22px;
           width: 100%;
           height: 30px;
           color: #fff;
           border: none;
           border-radius: 4px;
           cursor: pointer;
       }
       .err-text{
           margin-top: 10px;
           font-size: 13px;
           color: #e60012;
       }
       ::-webkit-input-placeholder{
           color: rgba(0, 0, 0, 0.30) !important;
           font-weight: 200;
       }
       input:focus {
           outline: none;
       }
    </style>
</head>

<body>
    <div class="box">
        <img class="logo" src="data:image/jpeg;base64,{{logo}}" />
        <div class="tips"><span class="tips-title">{{password_tips}}</span></div>
    <form action="/link" method="POST">
        <input type="hidden" name="id" value="{{id}}" />
        <input type="hidden" name="type" value="{{type}}" />
        <input type="hidden" name="password_required" value="{{password_required}}" />
        <input type="hidden" name="title" value="{{title}}" />
        <input type="hidden" name="expires_at" value="{{expires_at}}" />
        <input type="hidden" name="item_type" value="{{item_type}}" />
        <input type="hidden" name="belongs_to" value="{{belongs_to}}" />
        <input type="hidden" name="theme" value="{{theme}}" />
        <input type="hidden" name="logo" value="{{logo}}" />
        <input type="hidden" name="product" value="{{product}}" />
        <input type="hidden" name="favicon" value="{{favicon}}" />
        <div class="input-box"><img class="lock" src="/static/media/lock.png" /><input class="password-input" type="password" name="password" value="{{password}}" placeholder="{{input_tips}}"/></div>
        <button class="button" style="background-color: {{theme}};" type="submit">{{share_ok}}</button>
        <div class="err-text"><span name="err_message">{{err_message}}<span /></div>
    </form>
    </div>
</body>

</html>
